<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta content="width=device-width,initial-scale=1.0, user-scalable=no" name="viewport"/>
    <meta content="yes" name=" apple-mobile-web-app-capable"/>
    <meta content="no" name="apple-touch-fullscreen"/>
    <meta content="black" name=" apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
    <title>首页</title>
    <link href="css/reset.css" rel="stylesheet" type="text/css"/>
    <link href="css/style.css" rel="stylesheet" type="text/css"/>
    <link href="css/swiper-3.2.7.min.css" rel="stylesheet" type="text/css"/>
    <!-- Animate.css -->
    <link rel="stylesheet" href="css/animate.css">
    <!-- Slit Slider css -->
    <link rel="stylesheet" href="css/slit-slider.css">
    <script src="js/modernizr-2.6.2.min.js"></script>
    <style>
        .swiper-container-horizontal>.swiper-pagination{
            bottom: 0.6rem!important;
        }
        .swiper-pagination-bullet.swiper-pagination-bullet-active{
            width: 0.8rem!important;
            height: 0.8rem!important;
            opacity: 1!important;
        }
        .swiper-pagination-bullet{
            width: 0.4rem!important;
            height: 0.4rem!important;
            background: #fff!important;
            opacity: 1!important;
        }
    </style>
</head>
<body id="body">
<!--head-start-->
<div class="headBox indexHead">
    <div class="pd-40 clearfix">
        <img class="logo fl" src="img/logo.png" alt=""/>
        <img class="menu fr" src="img/menu.png" alt=""/>
    </div>
    <ul class="nav">
        <li class="act"><a href="index.html">首页</a></li>
        <li><a href="服务.html">服务</a></li>
        <li><a href="下载.html">下载</a></li>
        <li><a href="关于我们.html">关于我们</a></li>
    </ul>
</div>
<!--head-end-->
<!--banner-start-->
<div class="swiper-container" id="banner">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <img src="img/banner01.png" width="100%;" />
            <p class="wow fadeInUp" data-wow-duration="500ms">赋能养殖户丰产再丰收</p>
        </div>
        <div class="swiper-slide">
            <img src="img/banner02.png" width="100%;" />
            <p class="wow fadeInUp" data-wow-duration="500ms">一站式小龙虾F2B供应链服务平台</p>
        </div>
    </div>
    <div class="swiper-pagination"></div>
</div>
<!--banner-end-->
<!--SERVICE-start-->
<div class="serviceBox center">
    <div class="p-40">
        <!--title-->
        <div class="indexTitle">
            <h4 class="wow fadeIn">服务</h4>
            <hr>
            <h5 class="wow fadeInUp">SERVICE</h5>
        </div>
        <!--img-->
        <div class="imgApp">
            <img class="phone wow fadeInLeft" data-wow-duration="500ms" src="img/index_img_01.png" alt="">
            <img class="pc wow fadeInRight" data-wow-duration="500ms" src="img/index_img_02.png" alt="">
        </div>
        <!--list-->
        <ul class="imgList clearfix">
            <li class="wow fadeInUp" data-wow-duration="500ms">
                <i class="icon-01"></i>
                <div>
                    <h4>养殖标准化</h4>
                    <p>依托自身技术优势，为养殖户或合作伙伴提供农事、农技、农资服务，搭建标准化规模化的科技养殖体系。</p> 
                </div>
            </li>
            <li class="wow fadeInUp" data-wow-duration="500ms" data-wow-delay="250ms">
                <i class="icon-02"></i>
                <div>
                    <h4>品质标准化</h4>
                    <p>通过物联网技术实现24小时全过程监管，深化小龙虾产业链大数据的综合开发和利用，保证全流通环节产品溯源。</p>
                </div>
            </li>
            <li class="wow fadeInUp" data-wow-duration="500ms" data-wow-delay="500ms">
                <i class="icon-03"></i>
                <div>
                    <h4>交易标准化</h4>
                    <p>统一分级、统一定价、统一包装，实现小龙虾非标品的标准化和商品化，提升交易的效率和配送的便捷。</p>
                </div>
            </li>
        </ul>
        <!--region-->
        <div class="regionBox">
            <div class="leftBox wow fadeInUp" data-wow-duration="500ms" data-wow-delay="250ms">
                <h4>服务覆盖区域</h4>
                <p>中农生态正在不断扩大服务的覆盖区域，现已开通南京、苏州、无锡、常州四地苏南市场，2019年将继续深化在长三角地区的覆盖广度和合作深度，并进一步向福建、广东等华南地区拓展。</p>
            </div>
            <div class="rightBox wow fadeInUp" data-wow-duration="500ms" data-wow-delay="500ms">
                <img src="img/index_img_06.png" alt=""/>
            </div>
        </div>
    </div>
    <!--smallBanner-->
    <div class="smallBanner">
        <div class="smallBannerMain wow fadeInUp" data-wow-duration="500ms" data-wow-delay="250ms">
            <h4>关注中农了解中农</h4>
            <p>扫描二维码关注中农微信公众号</p>
            <img src="img/index_img_08.jpg" alt="">
        </div>
    </div>
</div>
<!--SERVICE-end-->
<!--SUPPLY CHAIN-start-->
<div class="supplyChainBox center">
    <!--title-->
    <div class="indexTitle">
        <h4 class="wow fadeIn">优秀供应链</h4>
        <hr>
        <h5 class="wow fadeInUp">SUPPLY CHINA</h5>
    </div>
    <ul class="clearfix">
        <li class="wow fadeInUp" data-wow-duration="500ms">
            <img src="img/index_img_09.png" alt=""/>
            <p>养殖基地</p>
        </li>
        <li class="wow fadeInUp" data-wow-duration="500ms" data-wow-delay="250ms">
            <img src="img/index_img_10.png" alt=""/>
            <p>物流体系</p>
        </li>
        <li class="wow fadeInUp" data-wow-duration="500ms" data-wow-delay="250ms">
            <img src="img/index_img_11.png" alt=""/>
            <p>覆盖门店</p>
        </li>
    </ul>
</div>
<!--SUPPLY CHAIN-ens-->
<!--redFoot--start-->
<div class="redFoot">
    <div class="wow fadeInUp" data-wow-duration="500ms">
        <span>丰产再丰收</span>
        <span>勤劳可致富</span>
    </div>
</div>
<!--redFoot--end-->
<!--whiteFoot--start-->
<div class="whiteFoot p-40 center">
    <div class="wow fadeInUp" data-wow-duration="500ms" data-wow-delay="250ms">
        <ul class="footNav clearfix">
            <li><a href="加入我们.html">加入我们</a></li>
            <li><a href="退换货.html">退换货政策</a></li>
            <li><a href="支付方式.html">支付方式</a></li>
        </ul>
        <p class="address">地址：江苏省南京市栖霞区元化路8号南大科学园 66 幢 C座 3-3F 层</p>
        <p class="tel">4000-727-527</p>
        <p class="time">周一至周日9:00-21:00（仅收市话费）</p>
        <p class="copyright">@2018&nbsp中农（南京）生态农业科技有限公司&nbsp&nbspAll Rights Reserved&nbsp&nbsp苏 I C P 备&nbsp&nbspp18033400-1 号</p>
    </div>
</div>
<!--whiteFoot--end-->
<!-- Main jQuery -->
<script src="js/jquery-2.1.4.min.js"></script>
<!-- Slitslider -->
<script src="js/swiper-3.2.7.min.js" type="text/javascript"></script>
<!-- Parallax -->
<script src="js/jquery.parallax-1.1.3.js"></script>
<!-- Custom Scrollbar -->
<script src="js/jquery.nicescroll.min.js"></script>
<!--wow.min Script-->
<script src="js/wow.min.js"></script>
<!--main js-->
<script src="js/main.js"></script>
<script>
    $(function() {
        var mySwiper = new Swiper ('#banner', {
            direction: 'horizontal',
            loop: true,
            autoplay:3000,
            autoplayDisableOnInteraction : false,
            pagination: '#banner .swiper-pagination' // 如果需要分页器
        });
        var slideHeight = $(window).height();
        var slideWidth = $(window).width();
        $('#banner .swiper-slide').css('height',slideHeight);
        $('#banner .swiper-slide p').css('width',slideWidth);
        $(window).resize(function(){'use strict',
                $('#banner .swiper-slide').css('height',slideHeight);
            $('#banner .swiper-slide p').css('width',slideWidth);
        });

    });
</script>
</body>
</html>